<template>
  <div class="j_box">
    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
      <el-tab-pane label="设备管理" name="1">
        <deviceList></deviceList>
      </el-tab-pane>
      <el-tab-pane label="设备分类" name="2">
        <deviceCategory></deviceCategory>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script setup lang="ts">
import deviceList from './deviceList.vue'
import deviceCategory from './deviceCategory.vue'
import { ref } from 'vue'
import type { TabsPaneContext } from 'element-plus'
const activeName = ref('1')
const handleClick = (tab: TabsPaneContext, event: Event) => {
  console.log(tab, event)
}
onMounted(() => { });
</script>
<style lang="scss" scoped>
.j_box {
  padding: 5px 15px;
  background-color: #fff;
  height: 100%;

  :deep(.el-tabs__item) {
    font-size: 16px;
    font-weight: 500;
  }
}
</style>
